<template>
  <div class="mt20">
    <el-collapse v-model="activeNames">
      <el-collapse-item
        class="pl10"
        v-for="(item, index) in infoList"
        :key="index"
        :title="item.name || `规则${index + 1}`"
        :name="index"
      >
        <zm-form class="ml20">
          <zm-form-item label="特殊限制规则：">
            {{ handleSetRuleType(item.type) }}
            <holiday-detail
              v-if="isShowAboutFilm(item.type)"
              class="wp60 ml90"
              :time-data="item.timeData"
              :time-type="item.timeType"
            />
          </zm-form-item>
          <zm-form-item
            label="选择影院："
            v-if="isShowAboutFilm(item.type)"
          >
            <zm-button v-if="item.relationType === '1'" type="text" @click="onLookCinemaName(item.relationId,item.relationName)">{{item.relationName}}</zm-button>
              <span v-else>{{item.relationName}}</span>
          </zm-form-item>
          <zm-form-item label="执行制式：" v-if="isShowCopyAndHall(item.type)">
            {{ item.copyType }}
          </zm-form-item>
          <zm-form-item label="执行影厅：" v-if="isShowCopyAndHall(item.type)">
            {{ item.hallType }}
          </zm-form-item>
          <zm-form-item label="选择影片：" v-if="+item.type === 3">
            {{ item.filmName }}
          </zm-form-item>
          <zm-form-item label="不可用排期：" v-if="+item.type === 5">
            {{ item.planKey }}
          </zm-form-item>
          <zm-form-item label="可用排期：" v-if="+item.type === 4">
            {{ item.planKey }}
          </zm-form-item>
        </zm-form>
        <set-price-table
          v-if="
            item.type === '3' &&
            item.ruleData &&
            item.ruleData.length > 0
          "
          :data="item.ruleData"
          disabled
          :y-axis="item.copyType"
          :x-axis="item.hallType"
        ></set-price-table>
      </el-collapse-item>
    </el-collapse>
    <!-- 查看影院 -->
    <look-cinema v-if="paramsObj.visible" v-model="paramsObj.visible" :obj="paramsObj.obj"></look-cinema>
  </div>
</template>

<script>
import tableMixin from '@/mixins/zmTableMixin'
import SetPriceTable from '@/components/SetPriceTable'
import useRuleMixin from '@/views/product/productConfig/components/Detail/components/UseRule/components/useRuleMixin'
import HolidayDetail from './components/HolidayDetail'
export default {
  name: 'DetailCollapse',
  components: { SetPriceTable, HolidayDetail },
  mixins: [tableMixin, useRuleMixin],
  props: {
    infoList: {
      // 接口数据
      type: Array,
      default: () => {
        return []
      }
    },
    exchangeRange: {
      // 兑换范围 1线上；2线下
      type: String,
      default: '1'
    }
  },
  data () {
    return {
      activeNames: [0],
      infoListAfter: []
    }
  },
  computed: {},
  watch: {},
  created () {},
  mounted () {},
  methods: {
    isShowAboutFilm (val) {
      return ['2', '3'].includes(val)
    },
    isShowCopyAndHall (val) {
      if (this.exchangeRange === '1') {
        return ['2', '3'].includes(val)
      } else {
        return ['3'].includes(val)
      }
    },
    // 特殊规则
    handleSetRuleType (val) {
      const online = {
        1: '不限制',
        2: '指定时间段不可用',
        3: '指定时间段指定影片补差',
        4: '仅指定排期可用',
        5: '指定排期不可用'
      }
      const offline = {
        1: '不限制',
        2: '指定时间段指定影城不可用',
        3: '指定时间段补差'
      }
      return this.exchangeRange === '1' ? online[+val] : offline[+val]
    }
  }
}
</script>

<style scoped lang='scss'>
</style>
